<template>
  <!-- 催收执行页-案件信息模块-申请材料信息 -->
  <section class="component apply-datum-info">
    <div class="data-title">
      <svg-icon iconName="jinjiancailiao"></svg-icon>
      <span>进件材料</span>
    </div>
    <data-box :data="attachDataSet.inputFile">
      <template slot="columns">
        <el-table-column :min-width="$helper.getColumnWidth(4)" label="材料名称" prop="name"></el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(4)" label="文件名称" prop="fileName">
          <template slot-scope="scope">
            <el-col :key="i" class="item" v-for="(v,i) in scope.row.customerPapers">
              <el-button @click="orgPreStep(scope,i)" size="small" type="text" v-if="fileTypeCheck(v.pictureName)">{{v.pictureName}}</el-button>
              <span v-else>{{v.pictureName}}</span>
            </el-col>
          </template>
        </el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(4)" label="上传时间" prop="uploadDate"></el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(3)" label="操作人" prop="operatorName"></el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(2)" label="操作" prop="下载">
          <template slot-scope="scope">
            <el-col :key="i" class="item" v-for="(v,i) in scope.row.customerPapers">
              <el-button @click="downloadFile(scope.row.filePath,scope.row.fileName)" size="small" type="text" v-show="scope.row.filePath">下载</el-button>
            </el-col>
          </template>
        </el-table-column>
      </template>
    </data-box>
    <div class="data-title">
      <svg-icon iconName="xianshanghetongxiazai"></svg-icon>
      <span>线上合同下载</span>
    </div>
    <data-box :data="attachDataSet.inputFile">
      <template slot="columns">
        <el-table-column :min-width="$helper.getColumnWidth(4)" label="材料名称" prop="name"></el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(4)" label="文件名称" prop="fileName">
          <template slot-scope="scope">
            <el-col :key="i" class="item" v-for="(v,i) in scope.row.customerPapers">
              <el-button @click="orgPreStep(scope,i)" size="small" type="text" v-if="fileTypeCheck(v.pictureName)">{{v.pictureName}}</el-button>
              <span v-else>{{v.pictureName}}</span>
            </el-col>
          </template>
        </el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(4)" label="上传时间" prop="uploadDate"></el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(3)" label="操作人" prop="operatorName"></el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(2)" label="操作" prop="下载">
          <template slot-scope="scope">
            <el-col :key="i" class="item" v-for="(v,i) in scope.row.customerPapers">
              <el-button @click="downloadFile(scope.row.filePath,scope.row.fileName)" size="small" type="text" v-show="scope.row.filePath">下载</el-button>
            </el-col>
          </template>
        </el-table-column>
      </template>
    </data-box>
    <div class="data-title">
      <svg-icon iconName="qitaxinxi"></svg-icon>
      <span>其他材料</span>
    </div>
    <data-box :data="attachDataSet.inputFile">
      <template slot="columns">
        <el-table-column :min-width="$helper.getColumnWidth(4)" label="材料名称" prop="name"></el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(4)" label="文件名称" prop="fileName">
          <template slot-scope="scope">
            <el-col :key="i" class="item" v-for="(v,i) in scope.row.customerPapers">
              <el-button @click="orgPreStep(scope,i)" size="small" type="text" v-if="fileTypeCheck(v.pictureName)">{{v.pictureName}}</el-button>
              <span v-else>{{v.pictureName}}</span>
            </el-col>
          </template>
        </el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(4)" label="上传时间" prop="uploadDate"></el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(3)" label="操作人" prop="operatorName"></el-table-column>
        <el-table-column :min-width="$helper.getColumnWidth(2)" label="操作" prop="下载">
          <template slot-scope="scope">
            <el-col :key="i" class="item" v-for="(v,i) in scope.row.customerPapers">
              <el-button @click="downloadFile(scope.row.filePath,scope.row.fileName)" size="small" type="text" v-show="scope.row.filePath">下载</el-button>
            </el-col>
          </template>
        </el-table-column>
      </template>
    </data-box>
  </section>
</template>

<script lang="ts">
import Vue from "vue";
import Component from "vue-class-component";
import { Prop } from "vue-property-decorator";
import { CASE_CHANNEL } from "~/config/enum.config";

@Component({
  components: {}
})
export default class ApplyDatumInfo extends Vue {
  private attachDataSet: any = {
    inputFile: []
  };
}
</script>

<style lang="less" scoped>
.page.apply-datum-info {
  .data-title {
    padding-left: 10px;
    line-height: 25px;
    font-size: 14px;
    font-weight: 600;
    color: #00bbca;
  }
}
</style>
